import axios from 'axios'
import router from '@/router'
import { getToken, removeToken } from './token'

// 导入根路径
import { VUE_APP_BASE_URL } from '@/app.config'
// 使用根路径
const request = axios.create({
  baseURL: VUE_APP_BASE_URL
})

// 对request设置请求拦截器
// request.interceptors.request.use(config=>{return config},error=>{return Promise.reject(error)})

request.interceptors.request.use(config => {
  // console.log(config)
// 统一对token做处理,携带给后台,在每个接口就不用再携带Authorization(把其余接口的headers去掉)
  const token = getToken()
  if (token) {
    config.headers.Authorization = `Bearer ${getToken()}`
  }
  return config
}, error => {
  return Promise.reject(error)
})

// 对request设置响应拦截器
// request.interceptors.response.use(resp=>{},error=>{})
request.interceptors.response.use(resp => {
  // http状态码以2或3开头会走到这里,表示成功
  // 在这里可以对成功的数据做点什么,如果不需要做,直接返回resp,给组件调用接口的地方
  return resp
}, error => {
  // http状态码以4或5开头会走到这里,表示失败
  // 对一个明显的错误做统一处理,就是token过期, 401状态码
  // console.log(error)
  if (error.response.status === 401) {
    // 1.删除本地的token
    removeToken()
    // 2.重新登录->跳转到登录页 .vue文件,也就是组件才有$router对象
    // js文件需要导入router/index.js下的router即可(this.$router===router=>true)
    router.replace('/login')
  }
  // 这里返回的错误会被接口的try catch捕获,不返回的话接口拿不到
  return Promise.reject(error)
})

export default request
